import Compile from './Compile'
import observe from './observe'
import Watcher from './Watcher'

export default class Vue {
  constructor(options) {
    console.log(options)
    // 把参数 options 对象存为 $options
    this.$options = options || {}
    // 数据
    this._data = options.data || undefined
    // 数据变为响应式
    observe(this._data)
    this._initData()
    // 调用默认的watch
    this._initWatch()
    // this._initComputed()
    // 模板编译
    new Compile(options.el, this)
  }

  _initData() {
    var self = this
    // 给vue中的data加上数据劫持
    Object.keys(this._data).forEach(key => {
      Object.defineProperty(self, key, {
        get: () => {
          return self._data[key]
        },
        set: newValue => {
          self._data[key] = newValue
        }
      })
    })
  }
  // 原来的watch就是数据检测，如果视图数据变化了他就通知各个组件，这里的watch是用户自己加的watch
  _initWatch() {
    var self = this
    var watch = this.$options.watch
    // console.log(watch) // {a: ƒ}
    // 给用户添加watch的属性添加Watcher
    Object.keys(watch).forEach(key => {
      new Watcher(self, key, watch[key])
    })
  }
}
